<template>
    <div>
        <el-button type="primary" @click="coinDialog('all')" size="medium">批量打币</el-button>
        <el-table
                :data="applyListData"
                style="width: 100%"
                @selection-change="handleSelectionChange"
        >
            <el-table-column
                    type="selection"
                    width="55">
            </el-table-column>
            <el-table-column
                    prop="mail"
                    label="用户名"
            >
                <template slot-scope="scope">
                    <template v-for="(item,key) of userMapData">
                        <template v-if="scope.row.userId == key">
                            <span>{{item}}</span>
                        </template>
                    </template>
                </template>
            </el-table-column>
            <el-table-column
                    prop="coin"
                    label="币种">
            </el-table-column>
            <el-table-column
                    prop="amount"
                    label="打币数量(已扣手续费)">
                <template slot-scope="scope">
                    <span>{{scope.row.amount-scope.row.money}}</span>
                </template>
            </el-table-column>
            <el-table-column
                    prop="toAddress"
                    label="提币地址">
            </el-table-column>
            <el-table-column
                    prop="status"
                    label="状态">
                <template slot-scope="scope">
                    <span v-if="scope.row.status == 0">已提交</span>
                    <span v-else-if="scope.row.status == 1">已发送</span>
                    <span v-else-if="scope.row.status == 2">成功</span>
                    <span v-else-if="scope.row.status == 3">失败</span>
                    <span v-else-if="scope.row.status == 4">驳回</span>
                    <span v-else-if="scope.row.status == 5">通过</span>
                </template>
            </el-table-column>
            <el-table-column
                    prop="createTime"
                    label="申请提币时间">
            </el-table-column>
            <el-table-column
                    prop="updateTime"
                    label="申请审核时间">
            </el-table-column>
            <el-table-column
                    label="操作"
                    width="220"
            >
                <template slot-scope="scope">
                    <el-button type="success" size="mini" @click="coinDialog(scope.row,scope.$index)">
                        打币
                    </el-button>
                </template>
            </el-table-column>
        </el-table>
        <el-pagination
                background
                layout="total, sizes, prev, pager, next"
                :page-size="pagination.pageSize"
                :total="pagination.total"
                :page-sizes="[10, 50, 100]"
                @size-change="handleSizeChange"
                @current-change="currentChange"
                @prev-click="requestGetApplyList(pagination.prePage)"
                @next-click="requestGetApplyList(pagination.nextPage)"
        >
        </el-pagination>


        <el-dialog title="" :visible.sync="dialogApplyFormVisible" :close-on-click-modal="false">
            <el-form ref="form" :model="formApply" label-width="80px">
                <!--                <el-form-item label="币种">-->
                <!--                    <el-select v-model="formApply.coin">-->
                <!--                        <el-option label="ETH" value="ETH"></el-option>-->
                <!--                        <el-option label="HD" value="HD"></el-option>-->
                <!--                    </el-select>-->
                <!--                </el-form-item>-->
                <template v-if="dialogFlag">
                    <el-form-item label="提币数量">
                        <el-input disabled v-model="formApply.count"></el-input>
                    </el-form-item>
                    <el-form-item label="提币地址">
                        <el-input disabled v-model="formApply.toAddress"></el-input>
                    </el-form-item>
                </template>
                <el-form-item label="GasLimit">
                    <el-input v-model="formApply.gasLimit"></el-input>
                </el-form-item>
                <el-form-item label="GasPrice">
                    <el-input v-model="formApply.gasPrice"></el-input>
                </el-form-item>
                <el-form-item label="发送地址">
                    <el-input v-model="formApply.from"></el-input>
                </el-form-item>
                <el-form-item label="秘钥">
                    <el-input type="password" v-model="formApply.privateKey"></el-input>
                </el-form-item>
            </el-form>
            <div slot="footer" class="dialog-footer">
                <el-button @click="dialogApplyFormVisible = false">取 消</el-button>
                <el-button type="primary" @click="onSubmit">确 定</el-button>
            </div>
        </el-dialog>

    </div>
</template>

<script>

    let api = '/manager/user_balance_record';

    export default {
        name: "UserApply",
        data() {
            return {
                type: 102,
                status: 5,
                applyListData: [],
                userMapData: {},
                dialogApplyFormVisible: false,
                dialogFlag: false,
                formApply: {
                    // coin: 'HD',
                    contractAddress: '0xbf2179859fc6d5bee9bf9158632dc51678a4100e',
                    // from: "",
                    // toAddress: "",
                    // count: '',
                    gasLimit: 100000,
                    gasPrice: 1,
                    // privateKey: '',
                    // privateKey: '0x7093e44e4723475dfa5176b8858a7ce65b80c068fd3e01ae90e86fef027e3747',
                },
                multipleSelection: [],
                allApplyFlag: false,
                pagination: {
                    total: 0,
                    pageSize: 10,
                    prePage: 0,
                    pageNum: 1,
                    nextPage: 0,
                }
            }
        },
        mounted() {
            this.requestGetApplyList(this.pagination.pageNum);
        },
        methods: {
            requestGetApplyList(page) {
                this.requestAxios.requestCMS('post', api + '/get_list.do', {
                    page: page,
                    size: this.pagination.pageSize,
                    type: this.type,
                    statusList: [this.status],
                }, (response) => {
                    // console.log('response == ', response);
                    let data = response.data.pageList;
                    this.applyListData = data.list;
                    this.userMapData = response.data.userMap;
                    this.pagination.total = data.total;
                    this.pagination.prePage = data.prePage;
                    this.pagination.pageNum = data.pageNum;
                    this.pagination.nextPage = data.nextPage;
                })
            },

            coinDialog(row) {
                if (row != 'all') {
                    this.allApplyFlag = false;
                    this.dialogFlag = true;
                    this.formApply.id = row.id;
                    this.formApply.toAddress = row.toAddress;
                    this.formApply.coin = row.coin;
                    this.formApply.count = row.amount-row.money;
                    this.dialogApplyFormVisible = true;
                } else {
                    if (this.multipleSelection.length == 0) {
                        alert("请勾选打币用户")
                    } else {
                        this.allApplyFlag = true;
                        this.dialogFlag = false;
                        this.dialogApplyFormVisible = true;
                    }
                }
            },
            onSubmit() {
                this.dialogApplyFormVisible = false;
                // console.log('formApply ==== ', this.formApply);
                if (this.allApplyFlag == false) {
                    // console.log('formApply ==', this.formApply)
                    // this.eth_util.sendTx(this.formApply, (data)=> {
                    //     this.requestApplyHash(data)
                    // })
                    this.tool_eth_util.batchSendTokenTx(this.formApply.from, [this.formApply], (data) => {
                        this.requestApply(data);
                        // console.log('data ==== ', data);
                        // this.requestApplyHash(data)
                    });
                } else {
                    let arr = [];
                    for (let i = 0; i < this.multipleSelection.length; i++) {
                        console.log(222,this.formApply,this.multipleSelection)
                        let item = { ...this.formApply,...this.multipleSelection[i]}
                        item.count = this.multipleSelection[i].amount-this.multipleSelection[i].money;
                        arr.push(item);
                        // this.multipleSelection[i].id = this.multipleSelection[i].id;
                        // this.multipleSelection[i].coin = this.multipleSelection[i].coin;
                        // this.multipleSelection[i].from = this.formApply.from;
                        // this.multipleSelection[i].toAddress = this.multipleSelection[i].toAddress;
                        // this.multipleSelection[i].count = this.multipleSelection[i].amount;
                        // this.multipleSelection[i].gasLimit = this.formApply.gasLimit;
                        // this.multipleSelection[i].gasPrice = this.formApply.gasPrice;
                        // this.multipleSelection[i].privateKey = this.formApply.privateKey;
                        // arr.push(this.multipleSelection[i]);
                    }
                    // this.multipleSelection = arr;
                    this.tool_eth_util.batchSendTokenTx(this.formApply.from, arr, (data, params) => {
                        this.requestApply();
                        // console.log('data ==== ', data);
                        // this.requestApplyHash(data)
                    });
                }
                alert("打币已完成，请勿重复发送，稍后请到链上确认");
            },
            requestApply() {
                this.$message.success({message: "操作成功！", duration: 1500});
                this.requestGetApplyList(1);
            },
            requestApplyHash(data) {
                if (data.hash) {
                    this.requestAxios.requestCMS('post', api + '/refresh_hash_code.do', {
                        id: data.params.id,
                        fromAddress: data.params.from,
                        hashCode: data.hash,
                    }, (response) => {
                        this.requestGetApplyList(this.pagination.pageNum);
                        this.dialogApplyFormVisible = false;
                        this.$notify({
                            message: "操作成功！",
                            duration: 1500
                        });
                    })
                } else {
                    this.$notify({
                        message: '请检查参数，确保账户有充足的余额和手续费！',
                        duration: 1500
                    });
                }
            },
            handleSelectionChange(val) {
                // // console.log('val = ',val);
                this.multipleSelection = val;
            },
            handleSizeChange(val) {
                this.pagination.pageSize = val;
                this.requestGetApplyList(this.pagination.pageNum)
            },
            currentChange(page) {
                this.requestGetApplyList(page)
            },
        },

    }
</script>

<style scoped>

</style>


